<template>
	<div>
		<Menu ref="menu" :open-names="[submenu]" :active-name="menuItem" width="auto" theme="dark" @on-select="changeHash">
			<Submenu name="activity">
				<template slot="title">
					<Icon type="ios-navigate"></Icon>
					活动立项及预算
				</template>
				<MenuItem name="/activity/search">查看活动</MenuItem>
				<MenuItem name="/activity/create">创建活动</MenuItem>
			</Submenu>

			<Submenu name="coupon">
				<template slot="title">
					<Icon type="ios-keypad"></Icon>
					优惠券
				</template>
				<MenuItem name="/coupon/search">查看优惠券</MenuItem>
				<MenuItem name="/coupon/create">创建优惠券</MenuItem>
			</Submenu>
		</Menu>	
	</div>
</template>

<script>
    export default {
        data() {
            return {
	            submenu : 'activity',
	            menuItem: '/activity/search'            	
            };
        },
        mounted() {

        },
        watch:{
            '$route':function(n,o){
                let arr = n.path.split("/");
                if(arr.length == 1){
                    this.submenu  =  'activity';                 
                    this.menuItem =  '/activity/search';                     
                }
                if(arr.length == 3){
                    this.submenu  =  arr[1];                 
                    this.menuItem =  n.path; 
                    this.$nextTick(()=>{
	                    this.$refs.menu.updateOpened();                                                       		                   	
                    });
                }
            }
        },        
        methods: {
          changeHash(val,event){
            this.$router.push({path:val})
          }
        }
    };
</script>

<style scoped>

 </style>